var _global = require('global/global.js');
var _layout = require('tools/layout.js');
var _relative = _layout.relative;
var _Container = require('component/container.js');
var _UIContainer = require('component/uicontainer.js');
var _inherit = require('core/inherit.js');
var _TouchEvent = require('event/touchevent.js');
var _vec3f = require('core/glm.js').vec3f;

var R = require('res/texture.js').R;
var S = require('res/style.js');
var _Cell = require('scenes/game/cell.js');

var _ButtonIds = require('event/buttonid.js');
var BUTTON_DOWN = _ButtonIds.BUTTON_DOWN;
var BUTTON_UP = _ButtonIds.BUTTON_UP;
var BUTTON_MOVE = _ButtonIds.BUTTON_MOVE;
var BUTTON_CANCEL = _ButtonIds.BUTTON_CANCEL;

var TWEEN = require('third_party/tweenjs/tween.js');
var _Helper = require('scenes/widget/tweenhelp.js');
var _Constance = require('./constance.js');

// ==========================
// DetailView
// ==========================
function Detail() {
    _Container.call(this);

    this.setSize(_Constance.detailSize);
    this.addChild(this.mBg = _global.colorNode('FFFFFF', _Constance.detailSize));

    this.addChild(this.mTitle = S.bonus.title.createText('Take a moment & say hello to...'));
    this.addChild(this.mName = S.bonus.card_name.createText('Capt. Triad'));
    this.addChild(this.mDetail = S.bonus.detail.createText('Conquered the seas without an orange. Returned wieh news of ants as a viable source of Vitamin C.'));
    this.addChild(this.mCell = new _Cell(10));

    this.layout();
}
_inherit(Detail, _Container);
Detail.prototype.layout = function () {
    _relative.local.layoutTo(this.mTitle, 0.5, 1, this, 0.5, 1, 0, -10);
    _relative.layoutTo(this.mName, 0.5, 1, this.mTitle, 0.5, 0, 0, -5);
    _relative.layoutTo(this.mCell, 1, 1, this.mName, 0.5, 0, -20, -5);
    _relative.layoutTo(this.mDetail, 0, 1, this.mName, 0.5, 0, 0, -5);
};
Detail.prototype.updateCount = function (count) {
    this.mCell.updateCount(count);
};

// ==========================
// Bonus
// ==========================
var STATUS_HIDDEN = 0;
var STATUS_VISABLE = 1;
var STATUS_ANIMA = 2;

var DIRECTION_NONE = -1;
var DIRECTION_LEFT = 0;
var DIRECTION_TOP = 1;
var DIRECTION_RIGHT = 2;
var DIRECTION_BOTTOM = 3;

var MIN_MOVE = 15;

function Bonus() {
    _UIContainer.call(this);
    this.setId('bonus');

    this.addChild(this.mDetail = new Detail());
    this.addChild(this.mSwipe = S.bonus.swipe.createText('SWIPE ANYWHERE TO KEEP PLAYING'));
    this.mDetail.setAnchor(0.5, 1);

    this.mMove = _Helper.createPoint();
    this.mDest = new _vec3f();
    this.mStatus = STATUS_HIDDEN;
    this.hide();

    this.mMaxMove = new Array(4);
    this.mMaxMove[DIRECTION_LEFT] = this.mMaxMove[DIRECTION_RIGHT] = 480;
    this.mMaxMove[DIRECTION_TOP] = this.mMaxMove[DIRECTION_BOTTOM] = 800;
    this.mDirection = DIRECTION_NONE;
    this.mMoveOffset = 0;// touch offset

    this.mDownEvent = new _TouchEvent();
    this.mDown = this.mDownEvent.vector;
    this.mLastEvent = new _TouchEvent();

    this.move = 0;

    var screen = _global.screen;
    var w = screen.width(), h = screen.height();
    this.resize(w, h);
}
_inherit(Bonus, _UIContainer);
/**
 * set the show position
 * @param x
 * @param y
 */
Bonus.prototype.setShowPosition = function (x, y) {
    this.mDest.set(x, y);
    this.mMove.setPosition(this.mDest);
};
/**
 * @param w
 * @param h
 */
Bonus.prototype.resize = function (w, h) {
    this.setSize(w, h);
    _relative.local.layoutTo(this.mSwipe, 0.5, 0, this, 0.5, 0, 0, 10);
};
Bonus.prototype.show = function (count) {
    this.mMove.setPosition(this.mDest);
    this.mMove.setDirection(0, 1);
    this.move = this.mMaxMove[DIRECTION_TOP];

    this.mDetail.updateCount(count);
    this.mDetail.setPosition(this.mMove.getPosition(this.move));
    this.mDetail.setVisiable(true);

    this.mStatus = STATUS_ANIMA;
    new TWEEN.Tween(this)
        .to({move: 0}, 0.7)
        .onUpdate(this.onAnimaMove)
        .onComplete(this.onShowFnish)
        .easing(TWEEN.Easing.Back.Out)
        .start();
};
Bonus.prototype.hide = function () {
    this.mDetail.setVisiable(false);
    this.mStatus = STATUS_HIDDEN;
};
Bonus.prototype.touchBegin = function (event) {
    event.cloneTo(this.mDownEvent);
    event.cloneTo(this.mLastEvent);

    this.mDirection = DIRECTION_NONE;
    this.mMoveOffset = 0;
};
Bonus.prototype.touchMove = function (event) {
    var vector = event.vector;
    var ox = vector[0] - this.mDown[0];
    var oy = vector[1] - this.mDown[1];

    if (this.mDirection == DIRECTION_NONE) {
        var aox = Math.abs(ox);
        var aoy = Math.abs(oy);
        if (aox > MIN_MOVE || aoy > MIN_MOVE) {
            if (aox > aoy) {
                this.mDirection = ox > 0 ? DIRECTION_RIGHT : DIRECTION_LEFT;
            } else {
                this.mDirection = oy > 0 ? DIRECTION_TOP : DIRECTION_BOTTOM;
            }
            switch (this.mDirection) {
                case DIRECTION_LEFT:
                    this.mMove.setDirection(-1, 0);
                    break;
                case DIRECTION_RIGHT:
                    this.mMove.setDirection(1, 0);
                    break;
                case DIRECTION_TOP:
                    this.mMove.setDirection(0, 1);
                    break;
                case DIRECTION_BOTTOM:
                    this.mMove.setDirection(0, -1);
                    break;
            }
        }
    }

    if (this.mDirection != DIRECTION_NONE) {
        switch (this.mDirection) {
            case DIRECTION_LEFT:
                this.mMoveOffset = ox < 0 ? -ox : 0;
                break;
            case DIRECTION_RIGHT:
                this.mMoveOffset = ox > 0 ? ox : 0;
                break;
            case DIRECTION_TOP:
                this.mMoveOffset = oy > 0 ? oy : 0;
                break;
            case DIRECTION_BOTTOM:
                this.mMoveOffset = oy < 0 ? -oy : 0;
                break;
        }
        this.mDetail.setPosition(this.mMove.getPosition(this.mMoveOffset));
    }
};
Bonus.prototype.touchEnd = function (event) {
    this.touchMove(event);

    // check if cancel slide
    if (this.mDirection != DIRECTION_NONE && this.mMoveOffset < MIN_MOVE) {
        this.mDirection = DIRECTION_NONE;
    }

    if (this.mDirection == DIRECTION_NONE) {
        this.mDetail.setPosition(this.mDest);
        return;
    }

    this.mStatus = STATUS_ANIMA;
    this.move = this.mMoveOffset;// already moved
    this.mMove.setPosition(this.mDest);
    var remain = this.mMaxMove[this.mDirection] - this.mMoveOffset;
    new TWEEN.Tween(this)
        .to({move: this.mMaxMove[this.mDirection]}, remain / 1200)
        .onUpdate(this.onAnimaMove)
        .onComplete(this.onHideFnish)
        .start();
};
Bonus.prototype.onShowFnish = function () {
    this.mStatus = STATUS_VISABLE;
    this.resetTouch();
};
Bonus.prototype.onHideFnish = function () {
    this.mStatus = STATUS_HIDDEN;
    this.mDetail.setVisiable(false);
    this.resetTouch();
};
Bonus.prototype.resetTouch = function () {
    this.mLastEvent.cloneTo(this.mDownEvent);
    this.mDirection = DIRECTION_NONE;
};
Bonus.prototype.onAnimaMove = function () {
    this.mDetail.setPosition(this.mMove.getPosition(this.move));
};
/**
 * delegate scene's touch
 * @param event
 * @returns {boolean}
 */
Bonus.prototype.onTouch = function (event) {
    if (this.mStatus != STATUS_VISABLE) {
        event.cloneTo(this.mLastEvent);// log this event
        return false;
    }

    var d = this.mDirection;
    switch (event.state) {
        case BUTTON_DOWN:
            this.touchBegin(event);
            break;
        case BUTTON_MOVE:
            this.touchMove(event);
            break;
        case BUTTON_UP:
            this.touchEnd(event);
            break;
    }

    if (d != this.mDirection) {
        event.setStateCancel();
        return false;
    }

    // if already in slide
    return this.mDirection != DIRECTION_NONE;
};

module.exports = Bonus;